<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    <title>news设计</title>
    <!-- Bootstrap -->
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/public.css" rel="stylesheet">
    <link href="../css/mobile.css" rel="stylesheet">
    <link href="../css/hoverlist.css" rel="stylesheet">
    <!--[if lt IE 9]>
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <div class="index-wrap newsdemo">
        <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button class="navbar-toggle collapsed green" type="button" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index.html"><img src="../img/pglog.png" alt=""/></a>
                </div>
                <div class="navbar-collapse collapse" role="navigation">
                    <ul class="nav navbar-nav navbar-right mb_hide">
                        <li class="shrink_l">
                            <a href="javascript:;">HOME</a>
                        </li>
                        <li class="shrink_l">
                            <a data-href="#about" class="txtT1">SERVICE</a>
                            <a data-href="#about" class="txtT2">服务</a>
                            <ul class="bgy">
                                <li class="bd0"><a href="adcultrue.html" >广告文化</a></li>
                                <li class="bd0"><a href="bussiness.html" >商业地产</a></li>
                                <li class="bd0"><a href="invest.html" >文创投资</a></li>
                                <li><a href="caterers.html" >餐饮休闲</a></li>
                            </ul>
                        </li>
                        <li class="shrink_l">
                           <a data-href="#news" class="txtT1">DYNAMIC</a>
                           <a data-href="#news" class="txtT2 lf40">动态</a>
                        </li>
                        <li class="shrink_l">
                            <a data-href="#custom" class="txtT1">CUSTOMER</a>
                            <a data-href="#custom" class="txtT2 lf48">客户</a>
                        </li>
                        <li class="shrink_l">
                            <a data-href="#team" class="txtT1">TEAM</a>
                            <a data-href="#team" class="txtT2 lf26">团队</a>
                        </li>
                        <li class="hidden-sm hidden-md shrink_l">
                            <a data-href="#contact" class="txtT1">CONTACT</a>
                            <a data-href="#contact" class="txtT2 lf40">联系</a>
                        </li>
                        <li>
                            <a href="#" class="nav-show-toggle green">
                                <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bussiness-navbar-collapse">
                                    <span class="sr-only">Toggle navigation</span>
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>
                                </button>
                            </a>
                        </li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right mb_show">
                      <li><a href="index.html" class="inactive">首页</a></li>
                      <li><a href="#" class="inactive">关于</a>
                        <ul style="display: none" class="sub_list">
                          <li>
                            <button class="adcult_t">广告文化</button>
                            <a href="javascript:;" class="inactive active">广告文化</a>
                            <ul style="display: none"  class="sub_list_s">
                              <li><a href="admedia.html">广告媒体</a></li>
                              <li><a href="newsdemo.html">品牌全案</a></li>
                              <li><a href="mountproduct.html">山水制品</a></li>
                            </ul>
                          </li> 
                          <li><a href="bussiness.html" class="inactive active">商业地产</a></li>
                          <li><a href="invest.html" class="inactive active">文创投资</a></li>
                          <li><a href="caterers.html" class="inactive active">餐饮休闲</a></li>
                        </ul>
                      </li>
                      <li><a href="trendslist.html" class="inactive">新闻动态</a>
                      <li><a href="#">客户服务</a></li>
                      <li><a href="talent.html">联系我们</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="mgt90">
            <img src="../img/newsdemop.jpg" alt="" />
            <div class="demo_picirl">
                <div class="demo_ad">
                  <img class="textBg loadImg" src="../img/gcentrp.png">
                  <div class="demo_btn">
                      <button type="button" class="btn btn-default viewmore" id="ad_viewM">VIEW MORE</button>
                  </div>
                </div>
            </div>
        </div>
        <div class="index-contents">
            <div class="index-about bgf8" id="about">
                <div class="container">
                    <h1 class="txt40 mg40">SERVICE<img class="react" src="../img/gnreact.png"/></h1>
                    <h2>秉承以创意为核心，提升企业品牌商业价值是我们最根本目的</h2>
                    <h4 class="txtg mg24">ADHERE TO THE CREATIVE CORE,ENHANCE THE COMMERCIAL VALUE OF THE BRAND IS OUR MOST FUNDAMENTAL PURPOSE</h4>
                    <div class="row mg60">
                        <div class="col-xs-6 col-md-3" data-href="service">
                            <div class="contents-lists">
                                <div class="hmt100"><img class="contentlogo" src="../img/service.png"></div>
                                <div class="mb_show news_list">
                                  <h3>品牌全案服务</h3>
                                  <span>Brand service</span>
                                </div>
                                <div class="text-center">
                                    <div class="txt_pic"><img src="../img/daimontxt.png"></div>
                                    <h3><span class="vert_rect">|</span><span class="verticl_pd">品牌全案服务</span><span class="vert_rect">|</span></h3>
                                    <div class="text-bg">
                                        <p>致力于追求企业长远可持续<br/>发展和管理效益及经营品质</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-6 col-md-3" data-href="design">
                            <div class="contents-lists">
                                <div class="hmt100"><img class="contentlogo" src="../img/design.png"></div>
                                <div class="mb_show news_list">
                                  <h3>互联网交互设计</h3>
                                  <span>Internet interactive design</span>
                                </div>
                                <div class="text-center">
                                    <div class="txt_pic"><img src="../img/targettxt.png"></div>
                                    <h3><span class="vert_rect">|</span><span class="verticl_pd">互联网交互设计</span><span class="vert_rect">|</span></h3>
                                     <div class="text-bg">
                                        <p>致力于追求企业长远可持续<br/>发展和管理效益及经营品质</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-6 col-md-3" data-href="plan">
                            <div class="contents-lists">
                                <div class="hmt100"><img class="contentlogo" src="../img/plan.png"></div>
                                <div class="mb_show news_list">
                                  <h3>公关活动策划</h3>
                                  <span>PR activities</span>
                                </div>
                                <div class="text-center">
                                    <div class="txt_pic"><img src="../img/startxt.png"></div>
                                    <h3><span class="vert_rect">|</span><span class="verticl_pd">公关活动策划</span><span class="vert_rect">|</span></h3>
                                    <div class="text-bg">
                                        <p>致力于追求企业长远可持续<br/>发展和管理效益及经营品质</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-6 col-md-3" data-href="marking">
                            <div class="contents-lists active">
                                <div class="hmt100 mb_show"><img class="contentlogo" src="../img/i_marking.png"></div>
                                <div class="hmt100 mb_hide"><img class="contentlogo" src="../img/marking.png"></div>
                                <div class="mb_show news_list">
                                  <h3>数字营销</h3>
                                  <span>Digital marketing</span>
                                </div>
                                <div class="text-center">
                                    <div class="txt_pic"><img src="../img/diagramtxt.png"></div>
                                    <h3><span class="vert_rect">|</span><span class="verticl_pd">数字营销</span><span class="vert_rect">|</span></h3>
                                    <div class="text-bg">
                                        <p>致力于追求企业长远可持续<br/>发展和管理效益及经营品质</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="top_line"></div>
                    <ul class="tab_pics">
                       <li data-toggle="service">service</li>
                       <li data-toggle="design">design</li>
                       <li data-toggle="plan">plan</li>
                       <li data-toggle="marking" class="current"><img src="../img/tab_demo.png" class="mb_hide"><img src="../img/custom_f.jpg" class="mb_show"></li>
                    </ul>
                </div>
            </div>
            <div class="index-news demo_damic" id="news">
                <div class="container">
                    <h1 class="pdt26 txt40">DYNAMIC<img class="react" src="../img/gnreact.png"/><div class="page_change"><img src="../img/prevbs.png" class="prev_img"/><img class="next_img" src="../img/nextb.png"/></div></h1>
                   <ul class="nav nav-pills" role="tablist">
                    <li role="presentation"><a href="javascript:;">ALL</a></li>
                    <li role="presentation"><a href="javascript:;">WEB</a></li>
                    <li role="presentation"><a href="javascript:;">APP/UI</a></li>
                    <li role="presentation"><a href="javascript:;">OTHER</a></li>
                  </ul>
                  <div class="row mg60 mb_show">
                      <div class="col-xs-6 col-md-3">
                        <a href="trends.html">
                          <div class="contents-news">
                              <div class="mask-bg"></div>
                              <div class="comlogo"><img src="../img/smalllog.png"></div>
                              <img src="../img/news1.jpg" class="hov_big">
                          </div>
                          <div class="news-title">
                              <h3>新龙AB栋代理营销</h3>
                              <h6>2015.03.07</h6>
                          </div>
                          <div class="bd3"></div>
                        </a>
                      </div>
                      <div class="col-xs-6 col-md-3">
                        <a href="trends.html">
                          <div class="contents-news">
                              <div class="mask-bg"></div>
                              <div class="comlogo"><img src="../img/smalllog.png"></div>
                              <img src="../img/news2.jpg" class="hov_big">
                          </div>
                          <div class="news-title">
                              <h3>大童8周年会议设计服务</h3>
                              <h6>2015.03.07</h6>
                          </div>
                          <div class="bd3"></div>
                          </a>
                      </div>
                      <div class="col-xs-6 col-md-3">
                        <a href="trends.html">
                          <div class="contents-news">
                              <div class="mask-bg"></div>
                              <div class="comlogo"><img src="../img/smalllog.png"></div>
                              <img src="../img/news3.jpg" class="hov_big">
                          </div>
                          <div class="news-title">
                              <h3>雅泰联合网站设计</h3>
                              <h6>2015.03.07</h6>
                          </div>
                          <div class="bd3"></div>
                          </a>
                      </div>
                      <div class="col-xs-6 col-md-3">
                        <a href="trends.html">
                          <div class="contents-news">
                              <div class="mask-bg"></div>
                              <div class="comlogo"><img src="../img/smalllog.png"></div>
                              <img src="../img/news4.jpg" class="hov_big">
                          </div>
                          <div class="news-title">
                              <h3>左陕右甘开业</h3>
                              <h6>2015.03.07</h6>
                          </div>
                          <div class="bd3"></div>
                          </a>
                      </div>
                  </div>
              </div>
                <div class="hove_list  mb_hide">
                  <ul id="demo-thumbs" class="row demo-thumbs mouse_slid mg60">
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>  
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                     <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>  
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                     <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>  
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                    <li>
                      <a href="design.html">
                        <img src="../img/mouse0.jpg" class="hov_big"/>
                        <div><span>landscape</span></div>
                      </a>
                    </li>
                  </ul>
                </div>
                  <div class="mg24 mb_mg0">
                      <button type="button" class="btn btn-default viewmore" id="viewMore">VIEW MORE</button>
                  </div>
            </div>
            <div class="index-custom mg60" id="custom">
              <div class="container">
                    <h1 class="pdt26 txt40">CUSTOMER<img class="react" src="../img/gnreact.png"/></h1>
                    <div class="demo_cus_log">
                      <img src="../img/demo_comp.jpg" class="mb_hide"/>
                      <img src="../img/demo_compm.jpg" class="mb_show"/>
                    </div>
                </div>
            </div>
            <div class="demo_team" id="team">
               <div class="container">
                    <h1 class="pdt26 txt40 mb_hide">TEAM<img class="react" src="../img/gnreact.png"/></h1>
                    <div class="row">
                      <div class="col-xs-3 col-md-3">
                          <div class="team_pic"><img src="../img/teamspic.jpg"></div>
                          <h3>Psiced . 谢</h3>
                          <div class="mb_show">
                            <p class="team_hor">设计总监</p>
                            <p class="team_en">Design Director</p>
                          </div>
                          <div class="mb_hide">
                            <p class="team_hor">设计总监 Design Director</p>
                            <p class="text-bg">感谢您来到山水投资若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复</p>
                          </div>
                      </div>
                      <div class="col-xs-3 col-md-3">
                          <div class="team_pic"><img src="../img/teamspic.jpg"></div>
                          <h3>Psiced . 谢</h3>
                           <div class="mb_show">
                            <p class="team_hor">设计总监</p>
                            <p class="team_en">Design Director</p>
                          </div>
                          <div class="mb_hide">
                            <p class="team_hor">设计总监 Design Director</p>
                            <p class="text-bg">感谢您来到山水投资若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复</p>
                          </div>
                      </div>
                      <div class="col-xs-3 col-md-3">
                          <div class="team_pic"><img src="../img/teamspic.jpg"></div>
                          <h3>Psiced . 谢</h3>
                           <div class="mb_show">
                            <p class="team_hor">设计总监</p>
                            <p class="team_en">Design Director</p>
                          </div>
                          <div class="mb_hide">
                            <p class="team_hor">设计总监 Design Director</p>
                            <p class="text-bg">感谢您来到山水投资若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复</p>
                          </div>
                      </div>
                      <div class="col-xs-3 col-md-3">
                          <div class="team_pic"><img src="../img/teamspic.jpg"></div>
                          <h3>Psiced . 谢</h3>
                           <div class="mb_show">
                            <p class="team_hor">设计总监</p>
                            <p class="team_en">Design Director</p>
                          </div>
                          <div class="mb_hide">
                            <p class="team_hor">设计总监 Design Director</p>
                            <p class="text-bg">感谢您来到山水投资若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复</p>
                          </div>
                      </div>
                    </div>
                </div>
            </div>
            <div class="index-contact" id="contact">
                <div class="container">
                    <h1 class="pdt26 txt40">CONTACT<img class="react" src="../img/gnreact.png"/></h1>
                    <div class="row mg60">
                      <div class="col-xs-12 col-md-6">
                         <div class="mb_show">
                            <h3 class="mg0">您好 HELLO!</h3>
                            <h5>感谢您来到山水投资，若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复，并为您提供最真诚的设计服务，谢谢！</h5>
                        </div>
                         <form role="form">
                            <div class="form-group">
                              <label for="custom-name">姓名 Name</label>
                              <input type="text" class="form-control" id="custom-name"/>
                            </div>
                            <div class="form-group">
                              <label for="custom-phone">电话 Phone</label>
                              <input type="text" class="form-control" id="custom-phone">
                            </div>
                            <div class="form-group">
                              <label for="custom-info">信息 Information</label>
                              <textarea class="form-control mb_hide" rows="10" id="custom-info"></textarea>
                              <textarea class="form-control mb_show" rows="8" id="custom-infom"></textarea>
                            </div>
                            <div class="mg20"><button type="button" class="btn btn-default btnc9">SEND</button></div>
                          </form>
                      </div>
                      <div class="col-xs-12 col-md-6">
                        <div class="mb_hide">
                            <h3 class="mg0">您好 HELLO!</h3>
                            <h5>感谢您来到山水投资，若您有合作意向，请您为我们留言或使用以下方式联系我们，我们将尽快给你回复，并为您提供最真诚的设计服务，谢谢！</h5>
                        </div>
                        <div class="contact-ways">
                           <ul class="list-unstyled">
                             <li>
                                <img src="../img/gphone.png"/>
                                <div class="contact-ways-ls">
                                  <p>广告文化：134-6679-9039</p>
                                  <p>商业地产：134-6679-9039</p>
                                  <p>品牌全案：134-6679-9039</p>
                                  <p>餐饮休闲：134-6679-9039</p>
                                </div>
                              </li>
                             <li class="mg20"><img src="../img/gmail.png"  class="maillogo"/><span>1234567@.163.com</span></li>
                             <li><img src="../img/gmap.png"/><span>北京市海淀区花园路小关街120号万盛商务会馆</span></li>
                           </ul>
                        </div>
                        <img src="../img/erwma.jpg" class="foot-erwma">
                      </div>
                    </div>
                    <div class="footer">
                      <p class="mb_hide">版权所有©山水投资 - 山水永道（北京）国际广告传播有限公司 | 京ICP备12048468号</p>
                      <img class="mb_show" src="../img/footl.jpg"/>
                      <div class="share-logo fr">
                        <img src="../img/footshare.jpg"/>
                      </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="float_lists mb_hide">
            <ul>        
                <li class="float_lists1"><a href="javascript:;" class="back_top"><img width="24" height="24" src="../img/float_top.png"></a></li>
                <li class="float_listsc float_lists2"><a href="javascript:;"><img width="24" height="24" src="../img/float_qq.png" target="_blank">点击咨询</a></li>
                <li class="float_listsc float_lists3"><a href="javascript:;" target="_blank"><img width="24" height="24" src="../img/float_phone.png">0755-28317087</a></li>
                <li class="float_lists4"><a href="javascript:;"><img width="24" height="24" src="../img/float_erw.png"></a><div class="float_shwx"><img width="188" height="188" alt="" src="../img/wx_img.jpg"></div></li>    
            </ul>
        </div>
         <div class="m_mask mb_show">
        </div>
      </div>
        <script src="../js/jquery-2.1.0.min.js"></script>
        <script src="../js/bootstrap.min.js"></script>
        <script src="../js/common.js"></script>
        <script src="../js/modernizr.custom.97074.js"></script>
        <script src="../js/jquery.hoverdir.js"></script>
        <script type="text/javascript">
        $(function() {
          //左侧边栏
           var height_F=$(window).height()- $(".float_lists").height();
           $(".float_lists").css("top",height_F/2);
          
           $(".float_listsc").hover(function() {
               var widLi=$(this).width();
               $(this).animate({left:-widLi+50},300);
           }, function() {
               var widLi=$(this).width();
               $(this).animate({left:0},300);
           });
           //二维码
           $(".float_lists4").hover(function() {
               $(".float_shwx").show();
           }, function() {
               $(".float_shwx").hide();
           });
           //滚动侧栏
           $(window).scroll(function(){
             var scrollTop=$(this).scrollTop();
             $(".float_lists").stop().animate({top:scrollTop+height_F/2},100);
           });

           //鼠标滑过
           $(".index-news .col-xs-6").hover(function() {
               $(this).addClass('active').siblings().removeClass('active');
           }, function() {
               $(this).removeClass('active');
           });
           //关于点击跳转
           $(".index-about .col-xs-6").click(function(){
               var togId=$(this).attr("data-href");
               var wid_m=$(this).find(".contents-lists").width();
                 if(!$(".tab_pics").find("li[data-toggle='"+togId+"']").hasClass('current')){
                    $(".tab_pics").find("li[data-toggle='"+togId+"']").addClass('current');
                    $(".tab_pics").find("li[data-toggle='"+togId+"']").siblings().removeClass('current');
                  }
                  $(this).find(".contentlogo").attr("src","../img/i_"+togId+".png");
                  $(this).siblings().find(".contentlogo").each(function(i,el){ $(el).attr("src",$(el).attr("src").replace(/i_/,''));});
                  if(!$(this).find(".contents-lists").hasClass('active')){
                    $(this).find(".contents-lists").addClass('active');
                     $(this).siblings().find(".contents-lists").removeClass('active');
                  }

           });
          
            $(".navbar-right li:not(:first)").click(function() {
               var listId=$(this).find("a:first").attr("data-href");
               var offSeTLt=0;
               if(listId==undefined){
                return;
               }
               offSeTLt=$(listId).offset().top;
               $("html,body").stop().animate({"scrollTop":offSeTLt-90},800);
            });
           //
           $(".index-about .row .col-xs-6").on({mouseover:function() {
                $(this).find('.text-bg').stop().animate({"bottom": "0px"},500);
                $(this).find(".contents-lists").css({"border":"1px solid #ccc","background":"#fff"}).stop().animate({"margin-top": "0"},300);
              },mouseout:function(){
                var wid_m=$(this).find(".contents-lists").width();
                if(wid_m>190){
                   $(this).find('.text-bg').stop().animate({"bottom": "-40px"},500);
                   $(this).find(".contents-lists").css({"background":"none","border":"none"}).stop().animate({"margin-top": "40px"},300);
                }
              }
             
            });
 
           $(".demo_team .col-md-3").on({mousemove:function() {
                $(this).find(".team_pic").css({"border":"4px solid #7bca1f"});
              },mouseout:function(){
                 $(this).find(".team_pic").css({"border":"none"});
              }
             
            });
           //鼠标经过效果
           $('#demo-thumbs > li ').each( function() { $(this).hoverdir(); } );
          
            $("#demo-thumbs li").hover(function() {
               $(this).addClass('active').siblings().removeClass('active');
           }, function() {
               $(this).removeClass('active');
           });
           $("#viewMore").click(function() {
             location.href="demo.html"
           });
           //翻页效果
           $(".prev_img").click(function(){
             var listWid=$(".hove_list").width();
             var str=$("#demo-thumbs").html();
             $("#demo-thumbs").animate({
               "margin-left":"-"+listWid+"px"
               },2000);
           });
            $(".next_img").click(function(){
             var listWid=$(".hove_list").width();
             $("#demo-thumbs").animate({
               "margin-left":"0"
               },2000);
           });
          
        });
        </script>
</body>

</html>
